<template>
    <view>
        <view class="list_header">
            <view
                @tap="tabClick"
                :class="'list_title ' + (activeIndex == index ? 'selsect' : 'default')"
                :id="index"
                :style="'color:' + (activeIndex == index ? color : '')"
                v-for="(item, index) in tabs"
                :key="index"
            >
                <view>{{ item }}</view>

                <view class="list_border" v-if="activeIndex == index" :style="'background-color:' + color + ';'"></view>
            </view>
        </view>
        <view class="list">
            <view class="list_imgbk2" v-if="!(order_list.length != 0 || !mygd)">
                <image class="list_imgbk" mode="aspectFit" src="https://yunkeososyunchuc.bc8t.cn/ymq_canyino2o/static/list.png"></image>
                <view class="list_imgbk3">您暂无相关明细哦！</view>
            </view>
            <view class="weui-cells weui-cells_after-title" v-for="(item, index) in order_list" :key="index">
                <view class="weui-cell">
                    <view class="weui-cell__bd" v-if="item.order_num != null">订单编号：{{ item.order_num }}</view>
                    <view class="weui-cell__bd" v-if="item.order_num == null">订单编号：{{ item.note }}</view>
                    <view class="weui-cell__ft" style="color: #999" v-if="item.type == '1'">外卖订单</view>
                    <view class="weui-cell__ft" style="color: #999" v-if="item.type == '2'">店内订单</view>
                    <view class="weui-cell__ft" style="color: #999" v-if="item.type == '3'">预约订单</view>
                    <view class="weui-cell__ft" style="color: #999" v-if="item.type == '4'">当面付订单</view>
                </view>

                <view class="weui-cell">
                    <view class="weui-cell__bd">
                        <view>分销等级：({{ item.note }})</view>
                        <view>下单时间：{{ item.time }}</view>
                    </view>
                    <view class="weui-cell__ft">预计佣金：+{{ item.money }}</view>
                </view>
            </view>
            <view class="jzz" v-if="!mygd">
                <image class="Rotation" src="https://yunkeososyunchuc.bc8t.cn/ymq_canyino2o/static/jzz.png"></image>
                <view>加载中...</view>
            </view>
            <view class="jzwb" v-if="mygd">
                <view class="hx"></view>
                <view class="wz">加载完毕</view>
                <view class="hx"></view>
            </view>
        </view>
    </view>
</template>

<script>
import cardlist from '@/ymq_canyino2o/dist/cardlist/index';
import gettel from '@/ymq_canyino2o/dist/gettel/index';
var app = getApp();
var util = require('../../utils/util.js');
export default {
    components: {
        cardlist,
        gettel
    },
    data() {
        return {
            pagenum: 1,
            order_list: [],
            storelist: [],
            mygd: false,
            jzgd: true,
            tabs: ['已完成', '未完成', '无效'],
            activeIndex: 0,
            color: ''
        };
    },
    onLoad: function (t) {
        app.globalData.setNavigationBarColor(this);
        this.reLoad();
    },
    onReady: function () {},
    onShow: function () {},
    onHide: function () {},
    onUnload: function () {},
    onPullDownRefresh: function () {},
    onReachBottom: function () {
        console.log('上拉加载', this.pagenum);
        if (!this.mygd && this.jzgd) {
            this.setData({
                jzgd: false
            });
            this.reLoad();
        }
    },
    methods: {
        tabClick: function (t) {
            this.setData({
                activeIndex: t.currentTarget.id,
                pagenum: 1,
                order_list: [],
                storelist: [],
                mygd: false,
                jzgd: true
            });
            this.reLoad();
        },

        reLoad: function () {
            var t;
            var that = this;
            var a = this.activeIndex;
            var e = uni.getStorageSync('users').id;
            var i = this.pagenum;
            if (0 == a) {
                t = '2';
            }
            if (1 == a) {
                t = '1';
            }
            if (2 == a) {
                t = '3';
            }
            console.log(a, t, e, i);
            app.globalData.util.request({
                url: 'entry/wxapp/CommissionList',
                cachetime: '0',
                data: {
                    type: t,
                    user_id: e,
                    page: i,
                    pagesize: 10
                },
                success: function (t) {
                    console.log('分页返回的列表数据', t.data);
                    for (var a = 0; a < t.data.length; a++) {
                        t.data[a].time = util.ormatDate(t.data[a].time);
                    }
                    if (t.data.length < 10) {
                        that.setData({
                            mygd: true,
                            jzgd: true
                        });
                    } else {
                        that.setData({
                            jzgd: true,
                            pagenum: that.pagenum + 1
                        });
                    }
                    var e = that.storelist;
                    e = (function (t) {
                        for (var a = [], e = 0; e < t.length; e++) {
                            if (-1 == a.indexOf(t[e])) {
                                a.push(t[e]);
                            }
                        }
                        return a;
                    })((e = e.concat(t.data)));
                    that.setData({
                        order_list: e,
                        storelist: e
                    });
                    console.log(e);
                }
            });
        }
    }
};
</script>
<style>
@import './detaulted.css';
</style>
